import React from 'react'
import './Comment.scss'
import StarScore from 'component/StarScore/startScore'
import { getCommentData } from '../actions/commentAction'
import { connect } from 'react-redux'
import CommentList from './CommentList/CommentList'
class Comment extends React.Component {
  constructor(props) {
    super(props)
    this.feachData()
  }
  feachData() {
    this.props.dispatch(getCommentData())
  }
  render() {
    return (
      <div className="comment">
        <div className="comment-header">
          <div className="header-left">
            <div className="left-score">4.6</div>
            <div className="left-word">商家评价</div>
          </div>
          <div className="header-center">
            <div className="center-teast">
              <div className="center-word">口味</div>
              <div className="center-star">
                <StarScore score={3} />
              </div>
              <div className="center-score">4.6</div>
            </div>
            <div className="center-package">
              <div className="center-word">包装</div>
              <div className="center-star">
                <StarScore score={4.5} />
              </div>
              <div className="center-score">4.5</div>
            </div>
          </div>
          <div className="header-right">
            <div className="right-score">4.9</div>
            <div className="right-word">商家评价</div>
          </div>
        </div>
        <CommentList/>
      </div>
    )
  }
}
export default connect(state => ({
  commentData: state.commentReducer.commentData
}))(Comment)
